<template>
	<view class="agriculturalBox" >
		<!-- 头部表格start -->
		<view class="messagehead">
			<view class="updata">
				<!-- 个人信息 -->
				<view class="archives">
					<view class="archives-title">
						<text>村庄信息</text>
					</view>
					<view class="archives-form">

						<view class="archives-form-item" style="background-color: ;" @click="cityShow=true">
							<view class="afi-label">
								<text></text>
								<text>市</text>
							</view>
							<input type="text" disabled v-model="this.city">
							<u-picker @cancel="cancel" :show="cityShow" :columns="cityColumns" keyName="name"
								@confirm="cityConfirm"></u-picker>
							<text></text>
						</view>
						<view class="archives-form-item" @click="divisionShow=true">
							<view class="afi-label">
								<text></text>
								<text>市区</text>
							</view>
							<u-picker @cancel="cancel" :show="divisionShow" :columns="divisionColumns" keyName="name"
								@confirm="divisionConfirm"></u-picker>
							<input type="text" disabled v-model="this.division">
							<text></text>
						</view>
						<view class="archives-form-item" @click="townShow=true">
							<view class="afi-label">
								<text></text>
								<text>镇街道</text>
							</view>
							<input type="text" disabled v-model="this.town">
							<u-picker @cancel="cancel" :show="townShow" :columns="townColumns" keyName="name"
								@confirm="townConfirm"></u-picker>
							<text></text>
						</view>
						<view class="archives-form-item" @click="villageShow=true">
							<view class="afi-label">
								<text></text>
								<text>村</text>
							</view>
							<u-picker @cancel="cancel" :show="villageShow" :columns="villageColumns" keyName="name"
								@confirm="villageConfirm"></u-picker>
							<input type="text" disabled v-model="this.village">
							<text></text>
						</view>

						<view class="archives-form-item">
							<view class="afi-label">
								<text></text>
								<text>地址全称</text>
							</view>
							<input type="text" v-model="fromdata.villageName">
							<text></text>
						</view>
						<view class="archives-form-item">
							<view class="afi-label">
								<text></text>
								<text>户数</text>
							</view>
							<input type="number" v-model="fromdata.households"
								@input="Numberfun(fromdata.households,'households') ">
							<text></text>
						</view>
						<view class="archives-form-item">
							<view class="afi-label">
								<text></text>
								<text>村党组织书记姓名</text>
							</view>
							<input type="text" v-model="fromdata.secAme">
							<text></text>
						</view>
						<view class="archives-form-item">
							<view class="afi-label">
								<text></text>
								<text>村党组织书记联系电话</text>
							</view>
							<input type="text" v-model="fromdata.secPhone">
							<text></text>
						</view>
						<view class="archives-form-item">
							<view class="afi-label">
								<text></text>
								<text>人口数量</text>
							</view>
							<input type="number" v-model="fromdata.popSize"
								@input="Numberfun(fromdata.popSize,'popSize')">
							<!-- {{typeof fromdata.popSize}} -->
							<text></text>
						</view>
						<view class="archives-form-item">
							<view class="afi-label">
								<text></text>
								<text>土地总面积(亩)</text>
							</view>
							<input type="digit" v-model="fromdata.totalLand"
								@input="Numberfun(fromdata.totalLand,'totalLand')">
							<text></text>
						</view>
						<view class="archives-form-item">
							<view class="afi-label">
								<text></text>
								<text>耕地总面积(亩)</text>
							</view>
							<input type="digit" v-model="fromdata.culLand"
								@input="Numberfun(fromdata.culLand,'culLand')">
							<text></text>
						</view>
						<view class="archives-form-item">
							<view class="afi-label">
								<text></text>
								<text>种植总面积(亩)</text>
							</view>
							<input type="digit" v-model="fromdata.plantLand"
								@input="Numberfun(fromdata.plantLand,'plantLand')">
							<text></text>
						</view>
						<view class="archives-form-item" style="border: none;">
							<view class="afi-label">
								<text></text>
								<text>户均种植面积(亩)</text>
							</view>
							<input type="digit" v-model="fromdata.aveLand"
								@input="Numberfun(fromdata.popSize,'popSize')">
							<text></text>
						</view>
						<view class="archives-form-item" style="border: none;">
							<view class="afi-label">
								<text></text>
								<text>农业特色产业</text>
							</view>
							<u-switch v-model="staBasicFrom" size="28"></u-switch>
							<text></text>
						</view>
					</view>
				</view>
			</view>
		</view>
		<!-- 头部表格end -->

		<!-- 特色产业start -->
		<view class="messageSubject" v-if="staBasicFrom" v-for="item in 1">
			<showFrom ref="perForm" keyName="nongdanCharttPo" :keyData="feaList"></showFrom>
		</view>
		<!-- 特色产业end -->

		<!-- 主体信息start -->
		<view class="messageSubject">
			<view class="recently-a">
				<view class="recently-a-a">
				</view>
				<view class="recently-a-b">
					主体信息
				</view>
			</view>
			<view class="archives-form">
				<u-form labelPosition="left" ref="mineForm">
					<mineFrom1 v-for="(item,index) in subjectType" :key="index" :subject="item.name" ref="sum"
						:subDatas="jsonParIfy(item.personList)" @changeVal="changeVal(index)" :typeBody="item.type">
					</mineFrom1>
					<u-button @click="subMineForm(subjectType)" class="main_form_btn">确认主体</u-button>
				</u-form>
			</view>
		</view>
		<!-- 主体信息end -->

		<!-- 个人经营基本信息 start-->
		<view v-for="(item,index) in perNums" :key="'idINdex'+index">
			<view class="basicInformation">
				<showFrom keyName="personPoList" ref="perForm" :keyData="preList" :index="index"></showFrom>
			</view>
		</view>
		<!-- 个人经营信息end -->

		<!-- 合作社信息start -->
		<view v-for="(item,index) in artNums" :key="'artNums'+index">
			<view class="messageSubject">
				<showFrom ref="perForm" keyName="cooperativePoList" :keyData="artList" :index="index"></showFrom>
			</view>
		</view>
		<!-- 合作社信息end -->

		<!-- 企业信息start -->
		<view v-for="(item,index) in comNums" :key="'comNums'+index">
			<view class="messageSubject">
				<showFrom ref="perForm" keyName="enterprisePoList" :keyData="comList" :index="index"></showFrom>
			</view>
		</view>
		<!-- 企业信息end -->
		<view class="bottom-btn">
			<button @click="draft(0)" class="draft"
				style="display: flex; align-items: baseline; justify-content: space-evenly;color: #999999;">
				<image style="width: 30rpx;height: 30rpx; color: #999999; " src="../../static/img/保存草稿.png" mode="">
				</image>存草稿
			</button>
			<button class="submit" type="default" @click="draft(1)">保存</button>
		</view>
	</view>
</template>

<script>
	import
	mineFrom1
	from "@/components/mineFrom1/mineFrom1.vue"
	import {
		agriculturalData
	} from "./config.js"
	import {
		industry
	} from "@/static/js/public/index.js"
	import {
		basicAdd
	} from "@/static/js/api/agricultural.js"
	import {
		areaData
	} from '@/static/js/api/area.js'
	import {
		jsonParIfy,set,get
	} from "@/static/js/uilt/index.js"
	export default {
		components: {
			mineFrom1
		},
		data: () => ({
			...agriculturalData,
			
		}),
		onShow() {
			console.log(this.fromdata,"66666");
			Object.keys(this.fromdata).forEach((key)=>{
			   this.fromdata[key] = '';
			})
			
		},
		mounted() {
			
			this.industry()
			this.getData(370000000000, 1)
		},
		methods: {
			// 地区选择start
			async getData(id, level) {
				await areaData(id, level).then(res => {
					switch (level) {
						case 1:
							this.cityColumns = [res.data];
						case 2:
							this.divisionColumns = [res.data];
						case 3:
							this.townColumns = [res.data];
						case 4:
							this.villageColumns = [res.data];
					}
				})
			},
			cityConfirm(e) {
				this.city = e.value[0].name
				this.cityShow = false
				this.getData(e.value[0].id, 2);
			},
			divisionConfirm(e) {
				this.division = e.value[0].name
				this.divisionShow = false
				this.getData(e.value[0].id, 3);
				this.town = '';
				this.village = ''
			},
			townConfirm(e) {
				this.town = e.value[0].name
				this.townShow = false
				this.getData(e.value[0].id, 4);
				this.village = ''
			},
			villageConfirm(e) {
				this.village = e.value[0].name
				this.fromdata.villageName = this.village
				this.villageShow = false
			},
			cancel() {
				this.cityShow = false
				this.divisionShow = false
				this.townShow = false
				this.villageShow = false
			},
			// 地区选择end
			jsonParIfy(e) {
				return e
			},
			Numberfun(e, name) {
				if (e && !isNaN(e)) {
					this.fromdata[name] = Number(e)
				}
			},
			integration() {},
			async industry() {
				let res
				let obj = await industry([1, 0])
				//主体信息预加载
				res = await industry([2, 0])
				this.subjectType = this.industryHandle(res.data, obj.data)
				// 个人预加载
				res = await industry([1, 2])
				this.preList = this.breedHandle(res.data, 'breedIds', this.preList)
				res = await industry([1, 1])
				this.preList = this.breedHandle(res.data, 'plantIds', this.preList)
				res = await industry([3, 0])
				this.preList = this.breedHandle(res.data, 'insure', this.preList)
				// 合作社预加载
				res = await industry([6, 0])
				this.artList = this.breedHandle(res.data, 'cooperativeType', this.artList)
				res = await industry([1, 0])
				this.artList = this.breedHandle(res.data, 'type', this.artList)
				res = await industry([4, 0])
				this.artList = this.breedHandle(res.data, 'score', this.artList)
				// 企业预加载
				res = await industry([1, 0])
				this.comList = this.breedHandle(res.data, 'industrys', this.comList)
				//特色产业预加载
				res = await industry([1, 0])
				this.feaList = this.breedHandle(res.data, 'type', this.feaList)
			},
			breedHandle(data, key, preList) {
				data = data.map(r => {
					r.disabled = false;
					r.name = r.name
					return r
				})
				preList.map(r => {
					if (r.key === key) {
						r.sctList = data
					}
					return r
				})
				return preList
			},
			//取回来的主体信息和子级
			industryHandle(data, obj) {
				obj = jsonParIfy(obj)
				let arrData = data.map(outer => {
					outer.personList = obj.map((e) => {
						e.type1 = outer.id
						return {
							...e
						}
					})
					return outer
				})
				return arrData
			},
			//存草稿/提交
			async draft(draftzt) {
				 
				let perForm = this.$refs.perForm;
				let arr = new Array
				perForm.forEach(r => {
					arr.push(r.Summary())
				})
				let obj = {}
				arr = jsonParIfy(arr)
				arr = arr.filter(k => {
					for (let key in k.form) {
						if (k.form[key] instanceof Array && k.form[key].length > 0) {
							if (typeof k.form[key][0] !== "object") {
								
								k.form[key] = JSON.stringify(k.form[key])
							}
						}
					}
					return k
				}).filter(k => {
					if (obj[k.keyName] instanceof Array) {
						obj[k.keyName].push(k.form)
					} else {
						obj[k.keyName] = [k.form]
					}					
					return k
				})

				const refMineFormEntities = this.$refs.sum;
				let arrData = new Array();
				refMineFormEntities.forEach(e => {
					let [obj, nums] = e.affirm()
					obj.forEach(event => {
						arrData.push({
							iid: event.id,
							nums: event.mun,
							type: event.type1
						})
					})
				})
				obj.entitiesList = []
				if (draftzt == 0) {
					obj = {
						...obj,
						...this.fromdata,
						entitiesList: arrData,
						city: this.city,
						division: this.division,
						town: this.town,
						village: this.village,
						status: 0
					}
				} else {
					obj = {
						...obj,
						...this.fromdata,
						entitiesList: arrData,
						city: this.city,
						division: this.division,
						town: this.town,
						village: this.village,
						status: 1
					}
				}
				// obj = {"nongdanCharttPo":[{"paymentPoList":[{"name":"err","money":200,"phone":"32525555555"}],"village_name":"测试","charttcName":"域名300","number":120,"last_y_output":200,"years":200,"type":2,"cate":"wwww","upstream":"ces","downstream":"ts"}],"entitiesList":[],"villageName":"金海湾居委会","households":200,"secAme":"cs","secPhone":"13354446820","popSize":120,"totalLand":200,"culLand":150,"plantLand":150,"aveLand":"80","city":"威海市","division":"威海火炬高技术产业开发区","town":"怡园街道","village":"金海湾居委会","status":1}
				// return console.log(JSON.stringify(obj))
				//nongdanCharttPo 修改数据格式，将数组转成对象
				if("nongdanCharttPo" in obj){
					obj.nongdanCharttPo = obj.nongdanCharttPo[0]
				}
				let res = await basicAdd(obj)
				uni.navigateBack()
				
				// uni.navigateBack()
			},
			//确认主体保存
			subMineForm(data) {
				let showData = this.$refs.sum
				this.perNums = showData[0].affirm()[1]
				this.artNums = showData[1].affirm()[1]
				this.comNums = showData[2].affirm()[1]
			},
		}
	}
</script>

<style lang="scss">
	@import "@/uni_modules/uview-ui/index.scss";

	* {
		font-size: 28rpx;
	}

	.bottom-btn {
		display: flex;
		justify-content: center;
		align-items: center;
		padding-bottom: 20rpx;
		padding-top: 10rpx;
		box-shadow: -2rpx 0 20rpx 2rpx #e0e5eb;
		background: #fff;
		width: 100%;
	}

	.draft {
		width: 190rpx;
		height: 80rpx;
		border: 2px solid #999999;
		border-radius: 40rpx;
	}

	.submit {
		width: 495rpx;
		height: 80rpx;
		background: linear-gradient(270deg, #1478FF 0%, #3BBCDC 100%);
		border-radius: 40rpx;
		;
		font-size: 28rpx;
		font-family: PingFang SC;
		font-weight: 500;
		color: #FFFFFF;
	}

	.agriculturalBox {
		width: 100%;
		height: auto;
		padding-bottom: 100rpx;
		background: #F4F4F4;

		.messagehead {
			width: 710rpx;
			background: #FFFFFF;
			border-radius: 20rpx;
			margin-left: 20rpx;

			.archives-title {
				padding: 15rpx 30rpx;
				background: #f5f2f8;
				font-size: 28rpx;
				color: #979698;
			}

			.archives-form {
				padding: 0 10rpx;

				input {
					font-size: 28rpx;
				}
			}

			.archives-form-item {
				display: flex;
				align-items: center;
				padding: 21rpx 0;
				border-bottom: 1rpx solid #f5f2f8;

				input {
					width: 100%;
					margin-left: 130rpx;
				}

				text {
					flex-shrink: 0;
				}
			}

			.afi-label {
				display: flex;
				align-items: center;
				font-size: 28rpx;
			}

			.afi-label>text:nth-child(1) {
				color: red;
				font-size: 26rpx;
				line-height: 30rpx;
				min-width: 20rpx;
			}

			.afi-label>text:nth-child(2) {
				min-width: 200rpx;
			}




		}

		.messageSubject {
			width: 710rpx;
			background: #FFFFFF;
			border-radius: 20rpx;
			margin-top: 20rpx;
			margin-left: 20rpx;
			margin-bottom: 35rpx;
			border: 1px solid #EEEEEE;
			box-shadow: 3rpx 3rpx 8rpx 0rpx rgba(0, 0, 0, 0.05);
			padding: 20rpx;


			.archives-form {
				input {
					font-size: 28rpx;
				}
			}

			.archives-form-item {
				display: flex;
				align-items: center;
				padding: 21rpx 0;
				border-bottom: 1rpx solid #f5f2f8;

				input {
					width: 100%;
					margin-left: 100rpx;
				}

				text {
					flex-shrink: 0;
				}
			}

			.afi-label {
				display: flex;
				align-items: center;
				font-size: 28rpx;
			}

			.afi-label>text:nth-child(1) {
				color: red;
				font-size: 26rpx;
				line-height: 30rpx;
				min-width: 20rpx;
			}

			.afi-label>text:nth-child(2) {
				min-width: 200rpx;
			}

			.mainNumber {
				width: 100%;
				// height: 200rpx;
			}

			.num_list {
				display: flex;
				align-items: center;
			}

			.num_text {
				margin-left: 250rpx;
			}

			.main_form_btn {
				width: 400rpx;
				height: 60rpx;
				background: #1478FF;
				border-radius: 30rpx;

				font-size: 28rpx;
				font-family: PingFang SC;
				font-weight: 500;
				color: #FFFFFF;
				margin-top: 30rpx;
				margin-bottom: 30rpx;
			}
		}

		.main_title {
			display: flex;
			justify-content: space-between;
			align-items: center;
			border-bottom: 1px solid #EEEEEE;
			height: 85rpx;
			font-size: 28rpx;
			font-family: PingFang SC;
			font-weight: 500;
			color: #333333;
		}

		.recently-a {
			height: 67rpx;
			display: flex;

			.recently-a-a {
				width: 6rpx;
				height: 28rpx;
				background: #1478FF;
				margin-top: 20rpx;
			}

			.recently-a-b {
				font-size: 28rpx;
				font-family: PingFang SC;
				font-weight: 800;
				color: #333333;
				margin-left: 8rpx;
				margin-top: 17rpx;
			}
		}

		.recently-a-j {
			height: 80rpx;
			margin-top: 5rpx;
			border-bottom: 1rpx solid #EEEEEE;
		}

		.basicInformation {
			width: 710rpx;
			height: auto;
			background: #FFFFFF;
			border-radius: 20rpx;
			margin-top: 20rpx;
			margin-left: 20rpx;
			margin-bottom: 20rpx;
			border: 1rpx solid #EEEEEE;
			box-shadow: 3rpx 3rpx 8rpx 0rpx rgba(0, 0, 0, 0.05);
			padding: 0 20rpx;
			padding-bottom: 20rpx;
		}

		.mine_mes {
			// position: relative;
			margin-bottom: 25rpx;
			// display: flex;
		}

		.mine_add_name {
			width: 250rpx;
			height: 87rpx;
			line-height: 87rpx;
		}

	}

	.textarea {
		border: solid 1px #ccc;
	}
</style>